<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  ~ Copyright 2020 huanggefan.cn
  ~
  ~ Licensed under the Apache License, Version 2.0 (the "License");
  ~ you may not use this file except in compliance with the License.
  ~ You may obtain a copy of the License at
  ~
  ~     http://www.apache.org/licenses/LICENSE-2.0
  ~
  ~ Unless required by applicable law or agreed to in writing, software
  ~ distributed under the License is distributed on an "AS IS" BASIS,
  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  ~ See the License for the specific language governing permissions and
  ~ limitations under the License.
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->

<!DOCTYPE html>

<html lang="zh">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content=webkit>
    <meta lang="zh">
    <link rel='stylesheet' type='text/css' href='/css/assets.css'>
    <script type='text/javascript' src='/js/assets.js'></script>
    <title>智慧课堂 - 管理员</title>
</head>
<body class="flex flex-col justify-start align-start">
<div style="display: none" id="manager-course-page"></div>

<nav class="width-full margin-b2">
    <ol class="breadcrumb">
        <li class="breadcrumb-item"><a class="text-primary" href="#" id="course-create">创建课程</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-update">更新课程</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-set">设置管理员</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-unset">移除管理员</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-delete">删除课程</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-choose">选择课程</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-chapter">章节管理</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-chapterEdit">章节编辑</a></li>
        <li class="breadcrumb-item"><a class="text-secondary" href="#" id="course-bank">题库编辑</a></li>
    </ol>
</nav>

<form id="create" style="display: flex" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full form-group margin-b3">
        <label for="create-college">选择学院</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="create-college"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="create-major">选择专业</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="create-major"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="create-name">课程名称</label>
        <input type="text" class="form-control" id="create-name" placeholder="">
    </div>
    <div class="width-full form-group margin-b3">
        <label for="create-description">课程描述</label>
        <input type="text" class="form-control" id="create-description" placeholder="">
    </div>
    <div class="flex-empty"></div>
    <button id="create-btn" type="button" class="btn btn-primary margin-t2 width-full">创建</button>
</form>
<form id="update" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full form-group margin-b3">
        <label for="update-college">选择学院</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="update-college"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="update-major">选择专业</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="update-major"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="update-course">选择课程</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="update-course"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="update-name">新课程名称</label>
        <input type="text" class="form-control" id="update-name" placeholder="">
    </div>
    <div class="width-full form-group margin-b3">
        <label for="update-description">新课程描述</label>
        <input type="text" class="form-control" id="update-description" placeholder="">
    </div>
    <div class="flex-empty"></div>
    <button id="update-btn" type="button" class="btn btn-primary margin-t2 width-full">更新</button>
</form>
<form id="set" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full form-group margin-b3">
        <label for="set-college">选择学院</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="set-college"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="set-major">选择专业</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="set-major"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="set-course">选择课程</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="set-course"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="set-account">授权用户</label>
        <input type="number" class="form-control" id="set-account" placeholder="学工号：17114455">
    </div>
    <div class="width-full form-group margin-b3">
        <label for="set-accountVerify">确认授权用户</label>
        <input type="number" class="form-control" id="set-accountVerify" placeholder="学工号：17114455">
    </div>
    <div class="flex-empty"></div>
    <button id="set-btn" type="button" class="btn btn-primary margin-t2 width-full">设置</button>
</form>
<form id="unset" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full form-group margin-b3">
        <div class="alert alert-warning">
            指定用户将失去课程管理权
        </div>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="unset-college">选择学院</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-warning" id="unset-college"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="unset-major">选择专业</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-warning" id="unset-major"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="unset-course">选择课程</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-warning" id="unset-course"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="unset-account">取消授权用户</label>
        <input type="number" class="form-control" id="unset-account" placeholder="学工号：17114455">
    </div>
    <div class="width-full form-group margin-b2">
        <label for="unset-accountVerify">确认取消授权用户</label>
        <input type="number" class="form-control" id="unset-accountVerify" placeholder="学工号：17114455">
    </div>
    <div class="flex-empty"></div>
    <button id="unset-btn" type="button" class="btn btn-warning margin-t2 width-full">移除</button>
</form>
<form id="delete" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full form-group margin-b3">
        <div class="alert alert-danger">
            警告：课程即将被删除
        </div>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="delete-college">选择学院</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-danger" id="delete-college"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="delete-major">选择专业</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-danger" id="delete-major"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="delete-course">选择课程</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-danger" id="delete-course"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="delete-verifyCourse">确认选择课程</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-danger" id="delete-verifyCourse"></select>
    </div>
    <div class="flex-empty"></div>
    <button id="delete-btn" type="button" class="btn btn-danger margin-t2 width-full">删除</button>
</form>
<form id="choose" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full form-group margin-b3">
        <label for="choose-college">选择学院</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="choose-college"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="choose-major">选择专业</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="choose-major"></select>
    </div>
    <div class="width-full form-group margin-b3">
        <label for="choose-course">选择课程</label>
        <!--<option value="1">信息与计算机学院</option>-->
        <select class="form-control text-primary" id="choose-course"></select>
    </div>
    <div class="flex-empty"></div>
    <button id="choose-btn" type="button" class="btn btn-primary margin-t2 width-full">选择</button>
</form>
<form id="chapter" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full" style="max-height: 44rem; overflow: auto" id="chapterList">
        <!--<div class="width-full margin-b1 flex flex-row justify-start align-center" style="height: 3.2rem">
            <div class="margin-r1 font-weight-bolder" style="max-width: 8rem; overflow: auto; white-space: nowrap">章节一</div>
            <div class="margin-r1" style="max-width: 64rem; overflow: auto; white-space: nowrap">章节一描述</div>
            <div class="flex-empty"></div>
            <button name="chapterBtn" data-toggle="modal" data-target="#setChapterModal" type="button"
                    class="margin-r1 btn btn-primary" value="" onclick="window.chooseChapterUUID=this.value">设置管理员</button>
            <button name="chapterBtn" data-toggle="modal" data-target="#unsetChapterModal" type="button"
                    class="margin-r1 btn btn-warning" value="">移除管理员</button>
            <button name="chapterBtn" data-toggle="modal" data-target="#deleteChapterModal" type="button"
                    class="margin-r1 btn btn-danger" value="">删除此章节</button>
        </div>-->
    </div>
    <div class="flex-empty"></div>
    <button data-toggle="modal" data-target="#createChapterModal" id="chapter-create-btn" type="button" class="btn btn-primary width-full">
        创建章节
    </button>
</form>
<form id="chapterEdit" style="display: none" class="flex-col justify-start align-start flex-grow width-full-6 margin-l3 margin-r3">
    <div class="width-full margin-b2 flex flex-row justify-start align-center">
        <!--<option value="1">章节一</option>-->
        <select aria-label="" class="form-control width-full-12 text-primary" id="chapterEdit-choose"></select>
        <div class="flex-empty"></div>
        <button data-toggle="modal" data-target="#chooseChapterToEditModal"
                id="chapterEdit-choose-btn" type="button" class="btn btn-primary margin-r1">选择编辑
        </button>
    </div>
    <div class="width-full margin-b1 flex flex-row justify-start align-center">
        <button id="chapterEdit-display" data-toggle="modal" data-target="#chapterEditDisplayModal" type="button"
                class="btn btn-primary margin-r1">预览</button>
        <button data-toggle="modal" data-target="#chapterEditSaveModal" type="button" class="btn btn-primary margin-r1">保存</button>
        <button data-toggle="modal" data-target="#chapterEditRollBackModal" type="button" class="btn btn-warning margin-r1">回滚</button>
    </div>
    <textarea id="chapterEdit-edit" class="width-full height-full padding-1 border border-secondary" aria-label=""></textarea>
</form>

<div class="modal" tabindex="-1" role="dialog" id="createChapterModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">创建章节</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <input aria-label="" type="text" class="form-control margin-b1" id="chapter-create-name" placeholder="章节名称">
                <input aria-label="" type="text" class="form-control margin-b1" id="chapter-create-description" placeholder="章节描述">
                <input aria-label="" type="number" class="form-control margin-b1" id="chapter-create-index" placeholder="章节序号">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-create-btn-submit" type="button" class="btn btn-primary">提交</button>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="setChapterModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">设置章节管理员</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-primary">即将设置管理员：章节一</div>
                <input aria-label="" type="number" class="form-control margin-b1" id="chapter-set-account" placeholder="学工号：17114455">
                <input aria-label="" type="number" class="form-control margin-b1" id="chapter-set-verifyAccount" placeholder="学工号：17114455">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-set-btn-submit" type="button" class="btn btn-primary">提交</button>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="unsetChapterModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">移除章节管理员</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning">警告即将移除管理员：章节一</div>
                <input aria-label="" type="number" class="form-control margin-b1" id="chapter-unset-account" placeholder="学工号：17114455">
                <input aria-label="" type="number" class="form-control margin-b1" id="chapter-unset-verifyAccount" placeholder="学工号：17114455">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-unset-btn-submit" type="button" class="btn btn-warning">提交</button>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="deleteChapterModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">删除章节</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-danger">警告即将删除章节</div>
                <input aria-label="" type="text" class="form-control margin-b1" id="chapter-delete-name" placeholder="输入章节名称">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-delete-btn-submit" type="button" class="btn btn-danger">提交</button>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="chooseChapterToEditModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">选择章节编辑</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-primary">即将编辑：章节一</div>
                <div class="alert alert-warning">
                    选中后，不可更改，需要更改请刷新页面
                    <br/>
                    刷新页面，不会保存数据，请确保数据以及保存
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-edit-btn-submit" type="button" class="btn btn-primary">确认</button>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="chapterEditDisplayModal">
    <div class="width-full height-full padding-2" role="document">
        <div class="modal-content width-full height-full">
            <div class="modal-header">
                <h5 class="modal-title">章节预览</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body markdown" id="chapterEditDisplayModal-body" style="overflow: auto"></div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="chapterEditSaveModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">保存章节</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-primary">确认保存当前改动</div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-save-btn-submit" type="button" class="btn btn-primary">保存</button>
            </div>
        </div>
    </div>
</div>
<div class="modal" tabindex="-1" role="dialog" id="chapterEditRollBackModal">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">回滚章节</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="alert alert-warning">警告：确认放弃当前改动</div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
                <button id="chapter-rollback-btn-submit" type="button" class="btn btn-warning">回滚</button>
            </div>
        </div>
    </div>
</div>

</body>
</html>
